{% extends 'layout.html' %}
{% block content %}
<div class="container-fluid">
    <div class="panel panel-default">
        <div class="panel-heading"><span class="glyphicon glyphicon-search" aria-hidden="true"></span>查询条件</div>
        <form class="form-inline">
            <div class="panel-body">
                <div class="form-group">
                    <label for="jsyf">　1.结算月份</label>
                    {{select_jsyf}}
                </div>
                <div class="form-group">
                    <label for="wllx">　&nbsp;2.物料类型</label>
                    {{select_wllx}}
                </div>
                <div class="form-group">
                    <label for="fylb">　&nbsp;3.费用类别</label>
                    {{select_fylb}}
                </div>
                <div class="form-group">
                    <label for="gwh">　&nbsp;4.岗位号%</label>
                    <input type="text" class="form-control" id="gwh" name="gwh" value="{{gwh}}">
                </div>
                <div class="form-group">
                    <label for="wldm">　&nbsp;5.物料代码</label>
                    <input type="text" class="form-control" id="wldm" name="wldm" value="{{wldm}}">
                </div>
                <div class="form-group">
                    <label for="xmh">　&nbsp;6.％项目号%</label>
                    <input type="text" class="form-control" id="xmh" name="xmh" value="{{xmh}}"
                           placeholder="项目号模糊查询">
                </div>
                <div class="form-group">
                    <span>　</span>
                    <input type="hidden" name="page" value="{{page_1.number}}">
                    <input type="hidden" name="pagesize" value="{{page_1.paginator.per_page}}">
                    <input type="submit" class="btn btn-sm btn-primary" style="float: right;margin-top: -5px" value="查询">
                </div>
            </div>
        </form>
    </div>
    <div class="panel panel-default table-responsive">
        <div class="panel-heading">
            <span class="glyphicon glyphicon-list" aria-hidden="true"></span>
            物料领用列表
            <!-- Multiple Select -->
            <div class="input-group" style="float: right;">
                {{ select }}
                <span aria-hidden="true"> </span>
                <a href="{% url 'export-excel-receive' %}?jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}"
                   class="btn btn-sm btn-primary" style="margin-top: -5px">导出 Excel</a>
            </div>
        </div>

        <table class="table text-nowrap table-striped table-bordered table-hover" style="">
            <thead>
            <tr style="background-color: #5B9BD5;color: white">
                {% if fields.结算月份.0 %}
                <th>结算月份</th>
                {% endif %}
                {% if fields.领用单号.0 %}
                <th>领用单号</th>
                {% endif %}
                {% if fields.物料代码.0 %}
                <th>物料代码</th>
                {% endif %}
                {% if fields.中文品名.0 %}
                <th>中文品名</th>
                {% endif %}
                {% if fields.实发数量.0 %}
                <th>实发数量</th>
                {% endif %}
                {% if fields.实发领用金额.0 %}
                <th>实发领用金额</th>
                {% endif %}
                {% if fields.计量单位.0 %}
                <th>计量单位</th>
                {% endif %}
                {% if fields.物料类型.0 %}
                <th>物料类型</th>
                {% endif %}
                {% if fields.费用类别.0 %}
                <th>费用类别</th>
                {% endif %}
                {% if fields.申请人岗号.0 %}
                <th>申请人岗号</th>
                {% endif %}
                {% if fields.申请人姓名.0 %}
                <th>申请人姓名</th>
                {% endif %}
                {% if fields.发料完成确认日期.0 %}
                <th>发料完成确认日期</th>
                {% endif %}
                {% if fields.物料短描述.0 %}
                <th style="">物料短描述</th>
                {% endif %}
                {% if fields.计划行备注.0 %}
                <th>计划行备注</th>
                {% endif %}
                {% if fields.入库时间.0 %}
                <th>入库时间</th>
                {% endif %}
                {% if fields.项目号.0 %}
                <th>项目号</th>
                {% endif %}
                {% if fields.供应商名称.0 %}
                <th>供应商名称</th>
                {% endif %}
            </tr>
            </thead>
            <tbody>
            {% for row in page_1.object_list %}
            <tr>
                {% if fields.结算月份.0 %}
                <td>{{ row.结算月份 }}</td>
                {% endif %}
                {% if fields.领用单号.0 %}
                <td>{{ row.领用单号 }}</td>
                {% endif %}
                {% if fields.物料代码.0 %}
                <td>{{ row.物料代码 }}</td>
                {% endif %}
                {% if fields.中文品名.0 %}
                <td>{{ row.中文品名 }}</td>
                {% endif %}
                {% if fields.实发数量.0 %}
                <td style="text-align: right">{{ row.实发数量 }}</td>
                {% endif %}
                {% if fields.实发领用金额.0 %}
                <td style="text-align: right">{{ row.实发领用金额 }}</td>
                {% endif %}
                {% if fields.计量单位.0 %}
                <td>{{ row.计量单位 }}</td>
                {% endif %}
                {% if fields.物料类型.0 %}
                <td>{{ row.物料类型 }}</td>
                {% endif %}
                {% if fields.费用类别.0 %}
                <td>{{ row.费用类别 }}</td>
                {% endif %}
                {% if fields.申请人岗号.0 %}
                <td>{{ row.申请人岗号 }}</td>
                {% endif %}
                {% if fields.申请人姓名.0 %}
                <td>{{ row.申请人姓名 }}</td>
                {% endif %}
                {% if fields.发料完成确认日期.0 %}
                <td>{{ row.发料完成确认日期 }}</td>
                {% endif %}
                {% if fields.物料短描述.0 %}
                <td style=""> {{ row.物料短描述 }}</td>
                {% endif %}
                {% if fields.计划行备注.0 %}
                <td>{{ row.计划行备注 }}</td>
                {% endif %}
                {% if fields.入库时间.0 %}
                <td>{{ row.入库时间 }}</td>
                {% endif %}
                {% if fields.项目号.0 %}
                <td>{{ row.项目号 }}</td>
                {% endif %}
                {% if fields.供应商名称.0 %}
                <td>{{ row.供应商名称 }}</td>
                {% endif %}
            </tr>
            {% endfor %}
            <tr style="background-color: yellow">
                {% if fields.结算月份.0 %}
                <td></td>
                {% endif %}
                {% if fields.领用单号.0 %}
                <td></td>
                {% endif %}
                {% if fields.物料代码.0 %}
                <td></td>
                {% endif %}
                {% if fields.中文品名.0 %}
                <td style="text-align: center">本页合计<br>总合计</td>
                {% endif %}
                {% if fields.实发数量.0 %}
                <td style="text-align: right">{{ sum_row.实发数量__sum }}<br>{{ sum_all.实发数量__sum }}</td>
                {% endif %}
                {% if fields.实发领用金额.0 %}
                <td style="text-align: right">{{ sum_row.实发领用金额__sum }}<br>{{ sum_all.实发领用金额__sum }}</td>
                {% endif %}
                {% if fields.计量单位.0 %}
                <td></td>
                {% endif %}
                {% if fields.物料类型.0 %}
                <td></td>
                {% endif %}
                {% if fields.费用类别.0 %}
                <td></td>
                {% endif %}
                {% if fields.申请人岗号.0 %}
                <td></td>
                {% endif %}
                {% if fields.申请人姓名.0 %}
                <td></td>
                {% endif %}
                {% if fields.发料完成确认日期.0 %}
                <td></td>
                {% endif %}
                {% if fields.物料短描述.0 %}
                <td style="text-align: right"> {{ sum_row.物料短描述__count }}<br>{{ sum_all.物料短描述__count }}</td>
                {% endif %}
                {% if fields.计划行备注.0 %}
                <td></td>
                {% endif %}
                {% if fields.入库时间.0 %}
                <td></td>
                {% endif %}
                {% if fields.项目号.0 %}
                <td></td>
                {% endif %}
                {% if fields.供应商名称.0 %}
                <td></td>
                {% endif %}

            </tr>
            </tbody>
        </table>

<!--    分页    -->
        <nav aria-label="Page navigation">
            <ul class="pagination">
                {% if page_1.has_other_pages %}
                    {% if page_1.has_previous %}
                        <li><a href="?page=1&pagesize={{page_1.paginator.per_page}}&jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}">首页</a></li>
                        <li><a href="?page={{page_1.previous_page_number}}&pagesize={{page_1.paginator.per_page}}&jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}">上一页</a></li>
                    {%endif%}
                    <li><span>第&nbsp;{{page_1.number}}&nbsp;/&nbsp;{{ page_1.paginator.num_pages }}&nbsp;页</span></li>
                    {% if page_1.has_next %}
                        <li><a href="?page={{page_1.next_page_number}}&pagesize={{page_1.paginator.per_page}}&jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}">下一页</a></li>
                        <li><a href="?page={{page_1.paginator.num_pages}}&pagesize={{page_1.paginator.per_page}}&jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}">尾页</a></li>
                    {% endif %}
                {% else %}
                    <li><span>第&nbsp;1&nbsp;/&nbsp;1&nbsp;页</span></li>
                {% endif %}
                <div class="dropup btn-group"> <!-- dropup 上拉框 -->
                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                        {{page_1.paginator.per_page}} 条 <span class="caret"></span>
                    </button>
                    <ul class="dropdown-menu">
                        <li><a href="?page={{page_1.number}}&pagesize=10&jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}">10 条</a></li>
                        <li><a href="?page={{page_1.number}}&pagesize=20&jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}">20 条</a></li>
                        <li><a href="?page={{page_1.number}}&pagesize=50&jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}">50 条</a></li>
                        <li><a href="?page={{page_1.number}}&pagesize=100&jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}">100 条</a></li>
                        <li><a href="?page={{page_1.number}}&pagesize=500&jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}">500 条</a></li>
                        <li><a href="?page={{page_1.number}}&pagesize=1000&jsyf={{jsyf}}&wllx={{wllx}}&fylb={{fylb}}&gwh={{gwh}}&wldm={{wldm}}&xmh={{xmh}}">1000 条</a></li>
                    </ul>
                </div>

            </ul>
        </nav>
    </div>
</div>

{% endblock %}

{% block js %}
<script type="text/javascript">
    $(function () {
        $('#col_select').multipleSelect({
            onClose: function () {
                $.ajax({
                    url: '/receive/fields/?f=' + $('#col_select').multipleSelect('getSelects'),
                    type: 'GET',
                    success: function (res) {
                        if (!res.status)
                            alert(res.errors);
                        location.reload();
                    }
                });
            }
        });
    })

</script>
{% endblock %}